// 主要用于修复dark模式下的一些无法通过官方配置控制的样式

// 这是是dark-config.json中修改过默认主题后的变量配置，拿到这里是为了和配置统一，修改颜色缺陷
$--color-primary: #1c65b1;
$--color-success: #5c9722;
$--color-info: #235c6e;
$--color-warning: #9c6007;
$--color-danger: #940909;
$--color-text-primary: #f5f5f5;
$--color-text-regular: #d6d2d6;
$--color-text-secondary: #c2bdb6;
$--color-text-placeholder: #585653;
$--border-color-base: #383d40;
$--border-color-light: #363b3d;
$--border-color-lighter: #303030;
$--background-color-base: #313131;
$--border-color-extra-light: #2c2e32;
$--color-white: #151515;
$--color-black: #ffffff;
$--border-radius-base: 0;
$--border-radius-small: 0;
$--border-radius-circle: 100%;
$--alert-border-radius: $--border-radius-base;
$--button-primary-font-color: $--color-text-primary;
$--button-primary-border-color: $--color-primary;
$--button-success-font-color: $--color-text-primary;
$--button-warning-font-color: $--color-text-primary;
$--button-info-font-color: $--color-text-primary;
$--button-danger-font-color: $--color-text-primary;
$--pagination-background-color: #151515;
$--button-disabled-font-color: $--color-text-placeholder;

[data-theme] .el-menu {
  border: none;
}

// 禁用状态下按钮的字体颜色
[data-theme="dark"] .el-button.is-disabled {
  color: $--color-text-placeholder;
  &:hover {
    color: $--color-text-placeholder;
  }
}

// plain状态按钮的hover字体颜色，不包含默认按钮，因为这里按钮的样式编译默认为$--color-white
[data-theme="dark"] .el-button:not(.el-button--default):not(.is-disabled).is-plain {
  &:hover,
  &:focus {
    color: $--color-black;
  }
}

// 多选框
[data-theme="dark"] .el-radio-button__orig-radio:checked + .el-radio-button__inner {
  color: inherit;
}

// 一些深层嵌套的input的样式会被浏览器默认样式覆盖，重新设置背景，否则一直白色
[data-theme="dark"] .el-checkbox__input.is-disabled .el-checkbox__inner {
  background-color: inherit;
}

// 选择器多选模式下，选中生成的tag右边的x的颜色
[data-theme="dark"] .el-select__tags .el-tag.el-tag--info .el-tag__close {
  color: $--color-white;
}
// 级联选择器选择器多选模式下，选中生成的tag的颜色
[data-theme="dark"] .el-cascader .el-cascader__tags .el-tag {
  background-color: #161c1e;
}

// table开启striped后，样式会有问题，连官网都有问题，所以黑白都要改
[data-theme] .el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
  background: transparent;
}

[data-theme="dark"] .el-table__row.el-table__row--striped {
  background-color: #ffffff10;
  &:hover {
    background-color: $--background-color-base;
  }
}

[data-theme="light"] .el-table__row.el-table__row--striped {
  background-color: #87ceeb20;
  &:hover {
    background-color: #f5f7fa;
  }
}

[data-theme="dark"] .el-descriptions-item__label.is-bordered-label {
  background-color: transparent;
}

// loading在暗黑模式下的蒙版颜色
[data-theme="dark"] .el-loading-mask {
  background-color: #010109e6;
}

// drawer与dialog在暗黑模式下的蒙版颜色
[data-theme="dark"] {
  .el-drawer__wrapper,
  .el-dialog__wrapper {
    background-color: #020000b8;
  }
}

[data-theme="dark"] .el-message--info {
  background-color: $--color-white;
}

.el-range-editor .el-range-input {
  // 日期选择器会被浏览器默认样式覆盖，需要手动修改
  background-color: transparent;
}
